<!--
    父子通信
    1.父传子
      - 给子组件绑定属性传值；
      - 在子组件中使用 defineProps() 接收
    2.子传父
      - 父组件提供更改传递参数的方法；
      - 子组件通过 emit 触发事件（编译器宏获取）
-->
<script setup>
import SonCom from "@/components/Son.vue";
import {ref} from "vue";

const money = ref(100)
const getMoney = () => {
    money.value += 10
}
const handleChange = (newMoney) => {
    money.value = newMoney
}
</script>

<template>
    <h3 style="text-align: center;">Vue3-Study</h3>
    <hr>
    <div>
        I am Father. - {{ money }}
        <button @click="getMoney">挣钱</button>
    </div>
    <SonCom
        car="宝马"
        :money="money"
        @changeMoney="handleChange"
    />
</template>